<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>楼源表</title>

<!--biblioteca generica JS/Dinamica-->
<script type="text/javascript" src="${def:context}/action/script?random=" + Math.random()></script>

<script language="JavaScript" type="text/javascript" src="${def:context}/js/common.js"></SCRIPT>
<script language="JavaScript" type="text/javascript" src="${def:context}/js/WinOpen.js"></SCRIPT>
<!-- <link rel="stylesheet" type="text/css" href="${def:context}/tableStyles.css" /> -->
<STYLE TYPE="text/css">
THEAD {background-color:lightyellow; font-weight:bold}
TFOOT {background-color:lightgreen; font-weight:bold}
#myTABLE {background-color:bisque}
td { text-align: left }
td { vertical-align: top }

.hr0{ height:1px;border:none;border-top:1px dashed #0066CC;}
.hr1{ height:1px;border:none;border-top:1px solid #555555;}
.hr2{ height:3px;border:none;border-top:3px double red;}
.hr3{ height:5px;border:none;border-top:5px ridge green;}
.hr4{ height:10px;border:none;border-top:10px groove skyblue;}
.overlay {
	display: none;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	background-color: #ccccff;
	z-index: 1001;
	-moz-opacity: 0.5;
	opacity: .50;
	filter: alpha(opacity = 50);
	
}
</STYLE>
<SCRIPT LANGUAGE="JavaScript">
var theTable, theTableBody
function init() {
    theTable = (document.all) ? document.all.myTABLE :         document.getElementById("myTABLE");
    theTableBody = theTable.tBodies[0];
}
function appendRow(form) {
    insertTableRow(form, -1);
}
function addRow(form) {
    insertTableRow(form, form.insertIndex.value);
}
function insertTableRow(form, where) {
    var now = new Date();
    var nowData = [now.getHours(), now.getMinutes(), now.getSeconds(), 
        now.getMilliseconds()];
    clearBGColors();
    var newCell;
    var newRow = theTableBody.insertRow(where);
    for (var i = 0; i < nowData.length; i++) {
        newCell = newRow.insertCell(i);
        newCell.innerHTML = nowData[i];
        newCell.style.backgroundColor = "salmon";
    }
    updateRowCounters(form);
}
function removeRow(form) {
    theTableBody.deleteRow(form.deleteIndex.value);
    updateRowCounters(form);
}
function insertTHEAD(form) {
    var THEADData = ["Hours","Minutes","Seconds","Milliseconds"];
    var newCell;
    var newTHEAD = theTable.createTHead();
    newTHEAD.id = "myTHEAD";
    var newRow = newTHEAD.insertRow(-1);
    for (var i = 0; i < THEADData.length; i++) {
        newCell = newRow.insertCell(i);
        newCell.innerHTML = THEADData[i];
    }
    updateRowCounters(form);
    form.addTHEAD.disabled = true;
    form.deleteTHEAD.disabled = false;
}
function removeTHEAD(form) {
    theTable.deleteTHead();
    updateRowCounters(form);
    form.addTHEAD.disabled = false;
    form.deleteTHEAD.disabled = true;
}
function insertTFOOT(form) {
    var TFOOTData = ["Hours","Minutes","Seconds","Milliseconds"];
    var newCell;
    var newTFOOT = theTable.createTFoot();
    newTFOOT.id = "myTFOOT";
    var newRow = newTFOOT.insertRow(-1);
    for (var i = 0; i < TFOOTData.length; i++) {;
        newCell = newRow.insertCell(i);
        newCell.innerHTML = TFOOTData[i];
    }
    updateRowCounters(form);
    form.addTFOOT.disabled = true;
    form.deleteTFOOT.disabled = false;
}

function removeTFOOT(form) {
    theTable.deleteTFoot();
    updateRowCounters(form);
    form.addTFOOT.disabled = false;
    form.deleteTFOOT.disabled = true;
}
function insertCaption(form) {
    var captionData = form.captionText.value;
    var newCaption = theTable.createCaption();
    newCaption.innerHTML = captionData;
    form.addCaption.disabled = true;
    form.deleteCaption.disabled = false;
}
function removeCaption(form) {
    theTable.deleteCaption();
    form.addCaption.disabled = false;
    form.deleteCaption.disabled = true;
}
// housekeeping functions
function updateRowCounters(form) {
    var sel1 = form.insertIndex;
    var sel2 = form.deleteIndex;
    sel1.options.length = 0;
    sel2.options.length = 0;
    for (var i = 0; i < theTableBody.rows.length; i++) {
        sel1.options[i] = new Option(i, i);
        sel2.options[i] = new Option(i, i);
    }
    form.removeRowBtn.disabled = (i==0);
}
function clearBGColors() {
    for (var i = 0; i < theTableBody.rows.length; i++) {
        for (var j = 0; j < theTableBody.rows[i].cells.length; j++) {
            theTableBody.rows[i].cells[j].style.backgroundColor = "";
        }
    }
}
</SCRIPT>
</head>
<body onLoad="init()">

<br>
<center>

<div id="form">
<FORM NAME="formEditor">

<div id="divtable" style="display:none">
<H1>Modifying Tables</H1>
<HR>

<FIELDSET>
<LEGEND>Add/Remove Rows</LEGEND>
<TABLE WIDTH="100%" CELLSPACING=20><TR>
<TD><INPUT TYPE="button" VALUE="Append 1 Row" 
    onClick="appendRow(this.form)"></TD>
<TD><INPUT TYPE="button" VALUE="Insert 1 Row" onClick="addRow(this.form)"> at index: 
    <SELECT NAME="insertIndex">
        <OPTION VALUE="0">0
    </SELECT></TD>
<TD><INPUT TYPE="button" NAME="removeRowBtn" VALUE="Delete 1 Row" DISABLED 
    onClick="removeRow(this.form)"> at index: 
    <SELECT NAME="deleteIndex">
        <OPTION VALUE="0">0
    </SELECT></TD>
</TR>
</TABLE>
</FIELDSET>
<FIELDSET>
<LEGEND>Add/Remove THEAD and TFOOT</LEGEND>
<TABLE WIDTH="100%" CELLSPACING=20><TR>
<TD><INPUT TYPE="button" NAME="addTHEAD" VALUE="Insert THEAD" 
    onClick="insertTHEAD(this.form)"><BR>
    <INPUT TYPE="button" NAME="deleteTHEAD" VALUE="Remove THEAD" DISABLED 
        onClick="removeTHEAD(this.form)">
</TD>
<TD><INPUT TYPE="button" NAME="addTFOOT" VALUE="Insert TFOOT" 
    onClick="insertTFOOT(this.form)"><BR>
    <INPUT TYPE="button" NAME="deleteTFOOT" VALUE="Remove TFOOT" DISABLED 
        onClick="removeTFOOT(this.form)">
</TD>
</TR>
</TABLE>
</FIELDSET>
<FIELDSET>
<LEGEND>Add/Remove Caption</LEGEND>
<TABLE WIDTH="100%" CELLSPACING=20><TR>
<TD><INPUT TYPE="button" NAME="addCaption" VALUE="Add Caption" 
    onClick="insertCaption(this.form)"></TD>
<TD>Text: <INPUT TYPE="text" NAME="captionText" SIZE=40 VALUE="Sample Caption">
<TD><INPUT TYPE="button" NAME="deleteCaption" VALUE="Delete Caption" DISABLED 
    onClick="removeCaption(this.form)"></TD>
</TR>
</TABLE>
</FIELDSET>
<HR>
</div>
</FORM>

<TABLE ID="myTABLE" CELLPADDING=10 BORDER=1>
<TBODY>
</TABLE>
<TABLE class=table_comm cellSpacing=0 cellPadding=0 width="90%" border=0>
        <col width="80%">
        <col width="20%">
        <!--buttons-->
        <tr>
            <td align="center" colspan=1>
                <input type="button" class="cmd" value="关闭" onclick="window.close();" >
            </td>
        </tr>
    
</table>
    </div>

<!--panel de respuesta AJAX #2 insert/update-->
<div id="response" style="display:none;width:100%">
</div>

<!--indicador de progreso-->
<br>
<div id="status" class="alert" style="text-align:left; display:none;color:gray;width:150px;font-weight:bold;font-family:Arial">
    <img src="${def:context}/images/progress.gif"> 请稍候！
</div>

</center>
</body>
</html>
<!--codigo de soporte del template-->
<script type="text/javascript">
    //返回
    function goBack() 
    {
        _goBackFn()         
    }
    
    //加载数据
    function edit(location_tuid,serial_no)
    {
            //llamada Ajax...
            ajaxCall(httpMethod="GET", 
                            uri="${def:actionroot}/edit?location_tuid=" + location_tuid+"&serial_no="+serial_no, 
                            divResponse="form", 
                            divProgress="status", 
                            formName=null, 
                            afterResponseFn=null, 
                            onErrorFn=null);    
    }
    //合计
    function evalTotal(){
        var banjia_fee = document.formEditor.banjia_fee.value;
        var touqin_fee = document.formEditor.touqin_fee.value;
        var suqian_fee = document.formEditor.suqian_fee.value;
        var other_fee = document.formEditor.other_fee.value;

        var total_fee = document.formEditor.total_fee;
        total_fee.value = parseInt(banjia_fee)+parseInt(touqin_fee)+parseInt(suqian_fee)+parseInt(other_fee);

    }
    //更新数据
    function update()
    {       
            _goBackFn = showEdit;
            
            return ajaxCall(httpMethod="POST", 
                            uri="${def:actionroot}/update", 
                            divResponse="response", 
                            divProgress="status", 
                            formName="formEditor", 
                            afterResponseFn=null, 
                            onErrorFn=showEdit);
    }
    
    //muestra el formulario principal
    function showForm()
    {
        document.getElementById("form").style.display="";     
    }
    
    //muestra el formulario principal para editar
    function showEdit()
    {
            //alert("showEdit");
            document.getElementById("form").style.display="";
            document.getElementById("response").style.display="none";   
    }

    //加载费用发放信息
    edit("${fld:location_tuid}","${fld:serial_no}");
</script>